@tailwind base;
@tailwind components;
@tailwind utilities;

@import "./base.css";


@primary-color: #1677ff;
// 主题背景色
@base-bg-color: #f0f2f5;

// header 默认高度
@base-header-height: 60px;
@base-header-height-rem: 0.6rem;

// 页面最小宽度
@body-min-width: 1280px;

// 主体颜色
@danger-color: #f66032;
@warning-color: #f4d63a;
@success-color: #17c23d;
@primary-color: #1677ff;
@black-color-0: #001a13;
@blue-color-1: #ddecf7;
@blue-color-2: #5fb7ff;

// 黑色
@black-color-1: #000;
@black-color-2: #5a5f66;

// 白色
@white-color-0: #fff;

// 灰度色
@gray-color-1: #f7f9fc;
@gray-color-2: #f0f2f7;
@gray-color-3: #e9ebf0;
@gray-color-4: #e1e4eb;
@gray-color-5: #d5d8de;

// Font
@font-size: 10px; // 移动端最小
@font-size-s: @font-size * 1.2; // 桌面端最小
@font-size-base: @font-size * 1.4; // 常用于正文
@font-size-l: @font-size * 1.6; // 常用于正文标题
@font-size-xl: @font-size * 1.8; // 常用于标题
@font-size-xxl: @font-size * 2; // 常用于大标题

// Line Height
@text-line-height: 18px; // 移动端最小
@text-line-height-s: 20px; // 桌面端最小
@text-line-height-base: 22px; // 常用于正文
@text-line-height-l: 24px; // 常用于正文标题
@text-line-height-xl: 28px; // 常用于标题

@font-family: Helvetica, PingFang SC, SF Pro, Microsoft YaHei, Arial Regular; // 字体-磅数-常规
@font-family-medium: Helvetica, PingFang SC, SF Pro, Microsoft YaHei, Arial Medium; // 字体-磅数-粗体




// 滚动条外观设置
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-thumb {
  width: 5px;
  height: 5px;
  background-color: #0000001a;
  border-radius: 5px;
}

.common-container {
  padding: 24px;
  height: 100%;

  > main {
    width: 100%;
    padding: 24px 32px 16px;
    background-color: @white-color-0;
  }
  .common-table-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: auto;
    .ant-table-wrapper {
      flex: 1;
    }
  }
}

@media (max-width: 1440px) {
  .common-container {
    padding: 16px;
    > main {
      padding: 16px 20px 12px;
    }
  }
}

// antd 样式覆盖
.room-info-popover {
  width: 280px;
}

.room-info-popover__alarm {
  width: 330px;

  .ant-popover-inner {
    padding: 0;
  }
}

// tag
.ant-tag {
  padding: 1px 8px;

  &-green {
    color: @success-color;
    background: #17c23d1a;
    border: 1px solid @success-color;
  }

  &-red {
    color: @danger-color;
    background: #f660321a;
    border: 1px solid @danger-color;
  }
}

// 弹窗
.ant-modal {
  .ant-modal-content {
    .ant-modal-title {
      margin-bottom: 24px;
    }
    .ant-modal-confirm-body {
      .ant-modal-confirm-content {
        margin-top: 20px;
        font-size: 16px;
      }
    }
  }
}

// Disabled checkbox/
.ant-checkbox-wrapper-disabled {
  .ant-checkbox-inner {
    background-color: #b4b4b4 !important; /* Custom background color */
    border-color: #d9d9d9 !important; /* Custom border color */
  }

  .ant-checkbox-checked .ant-checkbox-inner {
    background-color: #b4b4b4 !important; /* Custom background color for checked state */
    border-color: #d9d9d9 !important; /* Custom border color for checked state */
  }
}

.ant-radio-disabled {
  .ant-radio-inner {
    background-color: #b4b4b4 !important; /* Custom background color */
    border-color: #d9d9d9 !important; /* Custom border color */
  }
}

.ant-input-disabled,
.ant-select-disabled,
.ant-picker-disabled {
  background-color: #b4b4b4 !important; /* Custom background color */
  border-color: #b4b4b4 !important; /* Custom border color */
}

.ant-select-disabled {
  border-radius: 6px;
}

.ant-input.css-dev-only-do-not-override-usocwe {
  background-color: rgba(255, 255, 255, 0);
}

.ant-card .ant-card-head {
  padding: 0;
}

.ant-card .ant-card-body {
  padding: 0;
}

.ant-tabs .ant-tabs-content{
  height: 100%
}
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  position: relative;
  font-weight: normal;
}
html,
body {
  color: black;
  width: 100%;
  min-width: @body-min-width;
  height: 100%;
  padding: 0;
  margin: 0;
  // overflow-y: auto;
  font-size: @font-size-base;

  &::-webkit-scrollbar {
    height: 8px;
  }
}

h1,
h2,
h3 {
  margin: 0;
}

h1 {
  font-size: @font-size-xl;
  line-height: @text-line-height-xl;
}

h2 {
  font-size: @font-size-l;
  line-height: @text-line-height-l;
}

h3 {
  font-size: @font-size-base;
  line-height: @text-line-height-base;
}

p {
  margin: 0;
}
a{
  text-decoration: none;
  color: @primary-color;
  transition: 0.4s;
}

.ant-tabs-nav .ant-tabs-tab-active{
  color: @primary-color;
}
